<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title>安装门禁</title>
     <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge, chrome=1">
    <meta name="renderer" content="webkit">
    <link href="${pageContext.request.contextPath}/static/css/common.css" rel="stylesheet">
    <link href="${pageContext.request.contextPath}/static/plugins/bootstrap-3.3.5/css/bootstrap.min.css"
          rel="stylesheet">
    <link href="//cdn.bootcss.com/bootstrap-validator/0.5.3/css/bootstrapValidator.min.css" rel="stylesheet">          
    <link href="${pageContext.request.contextPath}/static/plugins/font-awesome-4.3.0/css/font-awesome.min.css"
          rel="stylesheet">
    <link href="${pageContext.request.contextPath}/static/plugins/select2-4.0.0/dist/css/select2.min.css"
          rel="stylesheet"/>

    <script src="${pageContext.request.contextPath}/static/js/jquery-1.11.3.min.js"></script>
    <script src="${pageContext.request.contextPath}/static/plugins/bootstrap-3.3.5/js/bootstrap.min.js"></script>
	<script src="//cdn.bootcss.com/bootstrap-validator/0.5.3/js/bootstrapValidator.min.js"></script>
    <script src="${pageContext.request.contextPath}/static/plugins/select2-4.0.0/dist/js/select2.min.js"></script>
<style type="text/css">
.lt{
float:left;
}
.control-label {
width:100px\9;
	*+width:100px;
	text-align:right\9;
	*+text-align:right;
}
.form-group{
	*+overflow:hidden;
}
.form-control{
	*+height:26px;
	width:500px\9;
	*+width:500px;
}
.col-sm-8  .form-control{
	*+height:26px;
	*+width:500px;
}
html{
 padding-left:100px\9;
 *+padding-left:50px;
}
.select2-selection__rendered{*+width:86%;}
#type{*+width:526px;*+height:34px;}
.select2-container--default .select2-selection--single .select2-selection__rendered{width:498px\9;}
</style>
</head>
<body>
<div class="col-sm-12">
    <form class="form-horizontal m-t" id="form" method="post"
          action="${pageContext.request.contextPath}/admin/tlocks_installTlocks2.action">
       	 <input type="hidden" name="communityId" value="${communityId}">
       	 
         <div class="form-group">
            <label class="col-sm-3  control-label lt"><i class="require">*</i>PID:</label>
            <div class="col-sm-8 lt">
               <input class="form-control" name="pid" id="pid"  size="30" />
            </div>
        </div>
         <div class="form-group">
            <label class="col-sm-3  control-label lt"><i class="require">*</i>激活码:</label>
            <div class="col-sm-8 lt">
               <input class="form-control" name="checkcode" id="checkcode"  size="30" />
            </div>
        </div>
        <div class="form-group">
            <label class="col-sm-3 control-label lt"><i class="require">*</i>门禁类型:</label>
            <div class="col-sm-8 lt">
               <select name="type" id="type" class="form-control col-md-1"  onchange="changeType()">
                   <option value="">请选择类型</option>
                   <option value="0">单元门禁</option>
                   <option value="1">公共门禁</option>
               </select>
            </div>
        </div>

         <div class="form-group">
	        <label class="col-sm-3 control-label lt">楼栋:</label>
	        <div class="col-sm-8 lt">
                  <select name="cBuildingId" id="cBuildingId" class="form-control"></select>
             </div>	
	    </div>
         <div class="form-group">
            <label class="col-sm-3  control-label lt">单元:</label>
            <div class="col-sm-8 lt">
                <select name="unitId" id="unitId" class="form-control"></select>
            </div>
        </div>
         <div class="form-group">
            <label class="col-sm-3  control-label lt"><i class="require">*</i>门禁名称:</label>
            <div class="col-sm-8 lt">
               <input class="form-control" name="lockname" id="lockname"  size="30" />
            </div>
        </div>
        </div>
    </form>
</div>
<script type="text/javascript">
function result(){
	   var bootstrapValidator = $("#form").data('bootstrapValidator');
	   bootstrapValidator.validate();
	   return bootstrapValidator.isValid();

}
$(function () {
	$('form').bootstrapValidator({
		message:'this value is not valid',
            fields: {
            	pid: {
                    message: 'pid验证失败',
                    validators: {
                        notEmpty: {
                            message: 'PID不能为空'
                        }
                    }
                },
                checkcode: {
                    validators: {
                        notEmpty: {
                            message: '激活码不能为空'
                        }
                    }
                },
                type:{
                	validators: {
                        notEmpty: {
                            message: '门禁类型不能为空'
                        }
                	}
                },
                lockname:{
	            	validators: {
	                    notEmpty: {
	                        message: '公共门禁必须填写门禁名称'
	                    }
	            	}
                },
                cBuildingId:{
                	validators: {
                        notEmpty: {
                            message: '单元门禁必须选择楼栋'
                        }                
                	}
                },
                unitId:{
                	validators: {
                        notEmpty: {
                            message: '单元门禁必须选择单元'
                        }                
                	}
         	
                }
            }
        });
	
	$('#form').data('bootstrapValidator').enableFieldValidators('cBuildingId', false);
	$('#form').data('bootstrapValidator').enableFieldValidators('unitId', false);
	$('#form').data('bootstrapValidator').enableFieldValidators('lockname', false);

	$.post("${pageContext.request.contextPath}/admin/cbuilding_list.action",{"communityId": '${communityId}'},function (data) {
        $("#cBuildingId").empty();
        $("#cBuildingId").append("<option value=''>请选择楼栋</option>");
        for (var i = 0; i < data.length; i++) {
            $("#cBuildingId").append("<option value='" + data[i].sid + "'>" + data[i].cbName + "</option>");
        }
        $("#cBuildingId").select2({
            "placeholder": "请选择楼栋",
            "width": "100%"
        })
        $("#unitId").select2({
             "placeholder": "请选择单元",
             "width": "100%"
	     })
	     
         $("#cBuildingId").change(function () {
           	var data = $(this).val();
           	$.post("${pageContext.request.contextPath}/admin/cinstallunit_listUnit.action", {"bsid": data},function (data) {
	            $("#unitId").empty();
	            $("#unitId").append("<option value=''>请选择单元</option>");
	            for (var i = 0; i < data.length; i++) {
	                $("#unitId").append("<option value='"+data[i].SID+"'>"+data[i].CBNAME+"</option>");
	            }
	        }, "json");
           })
    }, "json");

});

function changeType(){
	var type = $("#type").val();
	$("#cBuildingId").empty();  
	$("#unitId").empty(); 
	if(type=='1'){
		$('#form').data('bootstrapValidator').enableFieldValidators('cBuildingId', false);
		$('#form').data('bootstrapValidator').enableFieldValidators('unitId', false);
		$('#form').data('bootstrapValidator').enableFieldValidators('lockname', true);
        $("#cBuildingId").select2({
            "placeholder": "-",
            "width": "100%"
        })
        $("#unitId").select2({
             "placeholder": "-",
             "width": "100%"
	     })
	     $("#cBuildingId").attr("disabled", "true");
	     $("#unitId").attr("disabled", "true");
	     $("#lockname").val("");
	}else if(type==0){
		$('#form').data('bootstrapValidator').enableFieldValidators('cBuildingId', true);
		$('#form').data('bootstrapValidator').enableFieldValidators('unitId', true);
		$('#form').data('bootstrapValidator').enableFieldValidators('lockname', false);
	    $("#cBuildingId").select2({
	        "placeholder": "请选择楼栋",
	        "width": "100%"
	    })
	    $("#unitId").select2({
	         "placeholder": "请选择单元",
	         "width": "100%"
	     })
		$("#cBuildingId").removeAttr("disabled");
		$("#unitId").removeAttr("disabled");
	   	 $.ajax( {     
	            url:"${pageContext.request.contextPath}/admin/cbuilding_list.action",  
	            type:"post",  
	            dataType:"json", 
	            error:function(){alert("请求失败!");},  
	            success:function(data){  
	                if(data!=null && data!=""){  
	                    var str="";  
	                    $("#cBuildingId").append("<option value=''>请选择</option>");  
	                 	$("#unitId").empty(); 
	                 $("#unitId").append("<option value=''>请选择</option>");  
	                    for(var i=0;i<data.length;i++){  
	                    str+="<option value='"+data[i].sid+"'>"+data[i].cbName+"</option>";   
	                    }   
	                    $(str).appendTo($("#cBuildingId"));    
	                    }  
	                }  
		      });  
	}
}

</script>
</body>
</html>
